<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>{:C('sitename')}-充值申请</title>
		<meta name="format-detection" content="telephone=no,email=no"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
		<!-- <link href="__PUBLIC__/Admin/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet"> -->
		<!-- <link href="__PUBLIC__/Admin/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet"> -->
		<link href="__PUBLIC__/Admin/css/animate.min.css" rel="stylesheet">
		<!-- <link href="__PUBLIC__/Admin/css/style.min862f.css?v=4.1.0" rel="stylesheet"> -->
		<!-- <link href="__PUBLIC__/Home/css/page.css" rel="stylesheet"> -->
		<script src="__PUBLIC__/Home/js/flexible.js"></script>

	</head>
	<style type="text/css">
		/* body{
			overflow-y: scroll;
		}
		.facesj{
			display: inline-block;
			background-color: #1fa1dc;
			width: 60px;
		    height: 32px;
		    line-height: 32px;
		    border-radius: 3px;
		    text-align: center;
		    font-size: 14px;
		    margin-top:6px;
		    border: 1px solid #1fa1dc;
		    color: #FFF;
		    margin-left:10px;
		}
		img{max-width: 100%}
		.sk{width:70%;}
		.middle-box{padding-top:6px;}
		.zfbimg{display: none;}
		.ptitle{
			height: 45px;
			line-height: 45px;
		} */
		html,body{
			margin: 0;
			padding: 0;
			border: none;
			background: #fff;
			color: #323332;
		}
		label{
			float: left;
			font-size: 0.39rem;
			text-align: left;
			vertical-align: middle;
		}
		input{
			float: left;
			font-size: 0.39rem;
			color: #323332;
			vertical-align: middle;
		}
		.form-group{
			width: 82%;
			height: 1.2rem;
			margin: 0 auto;
			margin-bottom: 0.3rem;
			line-height: 1.2rem;
			padding-left: 0.2rem;
			border-bottom: 1px solid #e7e7e7;
		}
		.form-control{
			border-radius: 6px;
			border: none;
			outline: none;
			padding: 0;
			height: 0.8rem;
			width: 5rem;
			margin-top: 0.17rem;
		}
		.type_choose{
			color: #000;
		}
		.zfbimg{display: none;}
		.zfbimg img{
			width: 3rem;
			display: block;
			margin: 0 auto  0.3rem auto; 
		}
		.wximg img{
			width: 3rem;
			display: block;
			margin: 0 auto 0.3rem auto;  
		}
		footer {
		width: 10rem;
		height: 1.33rem;
		left: 50%;
		transform: translate(-50%);
		background-color: #131314;
		position: fixed;
		bottom: 0;
		z-index: 1111;
		display: flex;
		justify-content: space-around;
		box-sizing: border-box;
		padding: 5px 0;
	}

	footer a {
		color: #fff98d;
		display: block;
		text-align: center;
		text-decoration: none;
		-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
		-webkit-user-select: none;
		-moz-user-focus: none;
		-moz-user-select: none;
		font-size: 0.246rem;
	}
	footer a p{
		color: #fff98d;
		margin: 0;
	}
	footer a img{
		width:0.72rem;
		height: 0.653rem;
	}
	.black_overlay4{
            display: none;
            position: absolute;
            top: 0%;
            left: 0%;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index:100111;
            -moz-opacity: 0.8;
            opacity:.80;
            filter: alpha(opacity=88);
          }
          .white_content4 {
            display: none;
            position: absolute;
            top: 35%;
            /* left: 25%; */
            bottom: 0;
            width: 10rem;
            height: 14.33rem;
            /* padding: 20px; */
            /* border: 10px solid orange; */
            background-color: #262626;
            z-index:100211;
            /* overflow: auto; */
            border-top: 2px solid #ffe668;
          }
          .close4{
              display: none;
              width: 0.88rem;
              height: 2.09rem;
              position: absolute;
              top:24%;
              left:50%;
              bottom: 13.24rem;
              z-index: 111111;
              transform: translate(-0.44rem);
          }
         #light4>p{
              width: 10rem;
              margin: 0;
              height: 1.06rem;
              border-bottom: 1px solid #67603a;
              text-align: center;
              line-height: 1.06rem;
              font-size: 0.546rem;
              color: #ffe668;
		}
		header{
		width: 100%;
		height: 2.4rem;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		justify-content: space-around;
		align-items: center;
		padding: 0.8rem 48px;
		box-sizing: border-box;
	}
	nav,#button{
		width: 128px;
		height: 32px;
		line-height: 32px;
		font-weight: 480;
		font-size: 14px;
		border-radius: 4px;
		color: #fff;
		border: none;
		outline: none;
	}
	nav{
		background-color: #b7b7b7;
		height: 100%;
	}
	header nav a{
		width: 100%;
		height: 100%;
		display: block;
		text-align: center;
		font-size: 0.4rem;
		text-decoration: none;
		line-height: 32px;
		font-weight: 480;
		font-size: 14px;
		border-radius: 4px;
		color: #fff;
		border: none;
		outline: none;
		/* position: absolute; */
		/* left: 0.3rem; */
		-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
		-webkit-user-select: none;
		-moz-user-focus: none;
		-moz-user-select: none;
	}
	  .options{
		  width: 4.8rem;
	  }
	</style>
	<body>
		<!-- <div class="header">
		  <div class="all_w ">
		    <div class="gofh"> <a href="javascript:history.back()"><img src="/Public/Home/img/jt_03.jpg"></a> </div> -->
		   <!--  <div class="ttwenz">
		      <h4>在线充值</h4>
		      <h5>微信安全充值</h5>

		    </div> -->
		     <!-- <div class="ptitle">
		      在线充值
		        <a href="{:U('Home/Fen/xiapage')}" class="backgame">下分</a>
		    </div>
		  </div>
		</div> -->
	<form class="m-t form-horizontal " role="form" method="post" action="{:U('Home/Fen/add')}" id="LoginForm">
		<div class="middle-box text-center loginscreen  animated fadeInDown"  style="padding-top:0.4rem;">
			<div>
				<div class="form-group">
					<label class="col-sm-2 control-label">Recharge type：</label>
					<div class="col-sm-6">
						<select name="type" class="form-control type_choose">
							<option class="options" value="1">WeChat QR code recharge</option>
							<option class="options" value="2">Alipay QR code recharge</option>
						</select>
					</div>
				</div>
				<div class="wximg">
					<img class="sk" src="<if condition="$pay[wx_paycode] neq ''">__ROOT__/Uploads/{$pay.wx_paycode}<else/>__PUBLIC__/Admin/img/no_img.jpg</if>" >
				</div>
				<div class="zfbimg">
					<img class="sk" src="<if condition="$pay[zfb_paycode] neq ''">__ROOT__/Uploads/{$pay.zfb_paycode}<else/>__PUBLIC__/Admin/img/no_img.jpg</if>" >
				</div>
				
				<div class="form-group">
					<label class="control-label">nickname：</label>
					<div style="font-size: 0.39rem;">
						{$userinfo.nickname}
					</div>
				</div>

				<div class="form-group">
					<label class="control-label">Account Balance：</label>
					<div style="font-size: 0.39rem;">
						{$userinfo.points}
					</div>
				</div>

				<div class="form-group">
					<label class="control-label">Recharge amount：</label>
					<div style="font-size: 0.39rem;">
						<input type="text" id="money" name="money" class="form-control" required  onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'0')}else{this.value=this.value.replace(/\D/g,'')}">
					</div>
				</div>
				<input type="hidden" name="id" value="{$userinfo.id}">
			</div>
		</div>
		<header>
			<nav>
				<a href="/Home/User/index">return</a>
			</nav>
			<button type="submit" class="btn btn-success block full-width m-b" id="button" style="background: #08c261;">Deposit application</button>
		</header>
	</form>
		<!-- <footer>
			<a href=" /Home/Run/index"><img src="__PUBLIC__/Home/img/11.png" alt="">
				<p>主页</p>
			</a>
			<a href="{:U('Home/Run/active')}"><img src="__PUBLIC__/Home/img/12.png" alt="">
				<p>优惠活动</p>
			</a>
			<a href=" {:U('Home/User/index')}"><img src="__PUBLIC__/Home/img/13.png" alt="" >
				<p>个人中心</p>
			</a>
			<a href="#"  onclick ="openKefu()"><img src="__PUBLIC__/Home/img/14.png" alt="" >
				<p>在线客服</p>
			</a>
		</footer>
		<a href = "javascript:void(0)" onclick = "closeKefu()"><img src="__PUBLIC__/Home/img/close.png" alt=""  id="close4" class="close4">
		</a>
				<div id="light4" class="white_content4">
					<p>在线客服</p>
		   <img src="__PUBLIC__/Home/img/kefu1.jpg" alt="" style="display:block;width:6.33rem;height:8.26rem;margin:0.3rem auto;">
				   </div>
				<div id="fade4" class="black_overlay4"></div> -->
		<script src="__PUBLIC__/Admin/js/jquery.min.js?v=2.1.4"></script>
		<!-- <script src="__PUBLIC__/Admin/js/bootstrap.min.js?v=3.3.6"></script> -->
		<script src="__PUBLIC__/Common/js/ajaxForm.js"></script>
		<script src="__PUBLIC__/layer/layer.js"></script>
		<script>
	
			function openKefu(){
						  document.getElementById('light4').style.display='block';
						  document.getElementById('fade4').style.display='block';
						  document.getElementById('close4').style.display='block';
					  }
					function closeKefu(){
					  document.getElementById('light4').style.display='none';
					  document.getElementById('fade4').style.display='none';
					  document.getElementById('close4').style.display='none';
					}
		  </script>
		<script type="text/javascript">
			$('.type_choose').change(function(){
				var index = $(this).val();
				if (index == 1) {
					$('.wximg').show();
					$('.zfbimg').hide();
				} else if(index ==2){
					$('.wximg').hide();
					$('.zfbimg').show();
				}
			})

			$(function(){
				$('#LoginForm').ajaxForm({
					beforeSubmit: checkForm,
					success: complete, 
					dataType: 'json'
				});
				function checkForm(){
					
				}
				function complete(data){
					if(data.status==1){
						$('.btn').attr('disabled','disabled');
						layer.msg(data.info, function(index){
			 				layer.close(index);
							window.location.href=data.url;
						});
					}else{
						layer.msg(data.info);
						$('#password').val('').focus();
						return false;	
					}
				}
			});
		</script>
	</body>

</html>